<!-- 实名认证  -->
<template>
  <s-layout title="资料补充" :bgStyle="{ color: '#fff' }">
    <view>
      <!-- 标题栏 -->
      <view class="head-box ss-m-b-60">
        <view class="head-title ss-m-b-20">实名认证</view>
        <view class="head-subtitle"
          >根据国家法律法规，该产品需要强行进行身份认证，请按照如下表单要求进行认证，我们不会透露任何个人信息</view
        >
      </view>

      <!-- 表单项 -->
      <uni-forms
        ref="editIdentifyRef"
        v-model="state.model"
        :rules="state.rules"
        validateTrigger="bind"
        labelWidth="140"
        labelAlign="center"
      >
        <uni-forms-item name="name" label="姓名">
          <uni-easyinput
            placeholder="请输入真实姓名"
            v-model="state.model.name"
            type="name"
            maxlength="4"
            :inputBorder="false"
          ></uni-easyinput>
        </uni-forms-item>

        <uni-forms-item name="idNumber" label="身份证号">
          <uni-easyinput
            type="password"
            placeholder="请输入身份证号"
            v-model="state.model.idNumber"
            :inputBorder="false"
          >
          </uni-easyinput>
        </uni-forms-item>
      </uni-forms>

      <!-- 标题栏 -->
      <view class="head-box ss-m-b-60">
        <view class="head-title ss-m-b-20">推荐人信息</view>
        <view class="head-subtitle">根据产品要求，本产品需要您的推荐人信息，否则无法完成注册</view>
      </view>
      <uni-forms
        ref="editIdentifyRef"
        v-model="state.model"
        :rules="state.rules"
        validateTrigger="bind"
        labelWidth="140"
        labelAlign="center"
      >
        <!-- 表单项 -->
        <uni-forms-item name="recommenderMobile" label="电话">
          <uni-easyinput
            type="recommenderMobile"
            placeholder="请输入推荐人电话"
            v-model="state.model.recommenderMobile"
            :inputBorder="false"
          >
          </uni-easyinput>
        </uni-forms-item>
      </uni-forms>
      <button @tap="editIdentifySubmit" style="background-color: orange; margin: 20px; color: #fff">
        下一步
      </button>
      <button @tap="onLogout" style="background-color: #fff; margin: 20px; color: #000">
        退出
      </button>
    </view>
  </s-layout>
</template>

<script setup>
  import sheep from '@/sheep';
  import { ref, reactive, unref, onMounted, computed } from 'vue';
  import { code, password } from '@/sheep/validate/form';
  import UserApi from '@/sheep/api/member/user';

  // 表单
  const editIdentifyRef = ref(null);

  // 数据
  const state = reactive({
    model: {
      name: '',
      idNumber: '',
      recommenderMobile: '',
    },
    rules: {
      code,
      password,
    },
  });

  // 页面加载时进行实名检查
  onMounted(async () => {
    try {
      const isLogin = computed(() => sheep.$store('user').isLogin); //检查是否登录
      console.log('isLogin', isLogin.value);
      if (isLogin.value) {
        //登录
        const isname = await UserApi.isNameAuthenication();
        if (isname.data) {
          //实名
          let value = 0;
          const intv = setInterval(() => {
            sheep.$router.go('/pages/index/mainlogin'); // 跳转到登录页
            sheep.$helper.toast('该用户已实名');
            value++;
            if (value == 1) {
              clearInterval(intv);
            }
          }, 500);
        }
      } else {
        sheep.$router.go('/pages/index/mainlogin');
      }
    } catch (error) {
      sheep.$helper.toast('未知错误:', error);
    }
  });

  const onLogout = () => {
    sheep.$store('user').logout();
    sheep.$helper.toast('登出成功，正在返回');
    let value = 0;
    const intv = setInterval(() => {
      sheep.$router.go('/pages/index/mainlogin');
      value++;
      if (value == 1) {
        clearInterval(intv);
      }
    }, 500);
  };

  // 更改实名
  async function editIdentifySubmit() {
    if (
      state.model.name === '' ||
      state.model.idNumber === '' ||
      state.model.recommenderMobile === ''
    ) {
      sheep.$helper.toast('姓名、身份证号、推荐人电话不能为空');
      return; //回调
    }
    //这里手机号姓名等要求
    if (state.model.name.length <= 1) {
      sheep.$helper.toast('姓名位数不能少于2位');
      return; //回调
    }
    if (state.model.idNumber.length != 18) {
      sheep.$helper.toast('身份证号格式错误');
      return; //回调
    }
    if (state.model.recommenderMobile.length != 11) {
      sheep.$helper.toast('手机号码格式错误');
      return; //回调
    }
    // 参数校验
    const validate = await unref(editIdentifyRef)
      .validate()
      .catch((error) => {
        console.log('error: ', error);
      });
    if (!validate) {
      return;
    }
    // 发起请求
    const { code } = await UserApi.nameAuthenication(state.model);
    if (code !== 0) {
      return;
    }
    // 成功后，进入购买界面
    sheep.$router.go('/pages/register/category');
  }
</script>

<style lang="scss" scoped>
  @import '@/sheep/components/s-auth-modal/index.scss';

  .head-box,
  .uni-forms {
    margin: 30px;
    width: auto;
    height: auto;
  }

  .uni-forms-item__box {
    border: 1px solid #eee !important;
    margin: 30px;
  }
</style>
